﻿@model  Tuple<HotelRegistrationSystem.Models.HotelSearchModel, IEnumerable<HotelRegistrationSystem.Models.HotelIndexPageModel> >
    
@{
    ViewBag.Title = "Hotels";
}

@Styles.Render("~/Content/themes/start/css")

<div class="row">
    <section class="twelve columns">
       
        @if (ViewBag.IsManagementOn)
        {
            <div class="row">
                <div class="six columns">
                    @Html.ActionLink("Add New Hotel", "Create", null, new { @class = "button small success" }) <br /><br /><br />
                </div>
            </div>
        }
        else
        {
            <div class="row">
                <div class="six columns">
                    @*<div style="font-weight:bold">Filter</div>*@<br />
                    <div class="row">
                        <div class="six columns">
                            <button style='width:130px; height:40px; font-size:13px' id="btn-filter-hotels-modal" type="button" class="button small success">Find your place</button>
                            <div id="filter-hotels-dialog" title="Find your place"></div>
                        </div>
                    </div>
                </div>
                <div class="six columns">
                    <div style="font-weight:bold">Order By</div><br />
                    <button style='width:120px' id="btn-name-sort" type="button" class="button small success">Hotel Name</button> |
                    <button style='width:120px' id="btn-stars-sort" type="button" class="button small success">Stars Count</button> |
                    <button style='width:120px' id="btn-town-sort" type="button" class="button small success">Town Name</button>
                </div>
                <div class="six columns">
                    <br />
                    <button style='width:120px' id="btn-beds-sort" type="button" class="button small success">Beds Count</button> |
                    <button style='width:120px' id="btn-rooms-sort" type="button" class="button small success">Rooms Count</button>
                </div>              
            </div><br />
        }                  
        <div id="container">
            @foreach (var item in Model.Item2)
            {
                string picturePath = item.PictureName != string.Empty ?
                    string.Format("/Pictures_Hotels/{0}", item.PictureName) :
                    "~/Content/images/prod_large.jpg";
                string address = item.Address.ToString();
                
                    <div class="box photo col2">
                        <a href='@Url.Action("Details", "Hotel", new { id = item.HotelId })'>
                            <img height="42" width="42" src="@picturePath"
                                 onerror="this.src = '/Content/images/prod_large.jpg'"/>
                        </a>
                        <h4 style="text-align: center">
                            <strong class="name-sorter">@Html.DisplayFor(modelItem => item.Name)</strong>
                        </h4>
                        <ul class="rating-w-images">
                            <li class="stars-sorter" style="display: none">
                                @Html.DisplayFor(modelItem => item.Stars)
                            </li>
                            <li class="town-sorter" style="display: none">
                                @Html.DisplayFor(modelItem => item.Address.City)
                            </li>
                            @for (int i = 0; i < item.Stars; i++)
                            {
                                <li class="rated"></li>
                            }
                        </ul>
                        <div>
                            <p>
                                <span class="HoverAddress" original-title="Address<br />@address" >
                                    <b>Address:</b> @address<br />
                                </span>
                                <b>Phone:</b> @Html.DisplayFor(modelItem => item.PhoneNumber)<br />
                                <b>Email:</b> @Html.DisplayFor(modelItem => item.Email)<br />
                                <b>Total rooms:</b> <span class="rooms-sorter">@Html.DisplayFor(modelItem => item.RoomsCount)</span>
                                <b>Total beds:</b> <span class="beds-sorter">@Html.DisplayFor(modelItem => item.BedsCount)</span>
                            </p>
                        </div>
                        <p style="text-align: center">
                            @Html.ActionLink("Details", "Details",
                            new { id = item.HotelId },
                            new { @class = "button small radius" })
                            @if (ViewBag.IsManagementOn)
                            {
                                @Html.ActionLink("Edit", "Edit",
                                new { id = item.HotelId },
                                new { @class = "button small radius" }) <br />
                                @Html.ActionLink("Manage Reservations", "ReservationsManagement",
                                new { id = item.HotelId },
                                new { @class = "button small radius" })    
                            }
                        </p>
                    </div>        
            }
        </div>
        @if (!ViewBag.IsManagementOn)
        {
            @Html.Partial("_SecondLevelSearchInHotels", Model.Item1)
        }
    </section>
</div>

@section Scripts {
   
    @Scripts.Render("~/bundles/jqueryui")
    <script src="~/Scripts/CustumScripts/HotelIndexTooltips.js"></script>
    <script src="~/Scripts/CustumScripts/ClientSorting.js"></script>
    
    <script>
        $(function () {
            $("#btn-name-sort").click(function () {
                sorter("container", "name-sorter");
            });
            $("#btn-stars-sort").click(function () {
                sorter("container", "stars-sorter");
            });
            $("#btn-town-sort").click(function () {
                sorter("container", "town-sorter");
            });
            $("#btn-beds-sort").click(function () {
                sorter("container", "beds-sorter", true);
            });
            $("#btn-rooms-sort").click(function () {
                sorter("container", "rooms-sorter", true);
            });
            $('#filter-hotels-dialog').dialog({
                autoOpen: false,
                width: 405,
                resizable: false,
                modal: true,
                open: function (event, ui) {
                    $('#filter-hotels-dialog').css('overflow', 'hidden');
                    $('#search-header').hide(); // hide header for more space
                }
            });
            $('#btn-filter-hotels-modal').click(function () {
                $('#filter-hotels-dialog').load("@Url.Action("SearchHotelModalView")", function () {
                    $(this).dialog('open');
                });
                return false;
            });
        });
    </script>
}